import React, { Component  } from 'react';

//css
import './index.scss';
//组件
import LoginForm from './loginForm'
import RegisterForm from './registerFrom'
class Login extends Component {
    constructor(props) {
        super(props);
        this.state = {
            formType:'login'
        };
    }

    switchFrom = (value) => {
        this.setState({
            formType:value
        })
    };
    

    render() {
        const {formType} = this.state;
        return (
            <div className='form-warp'>
                <div>
                    <div className="form-header">
                        <h4 className={['column ',formType === 'login'?'columna':''].join('')} onClick={ () => this.switchFrom('login')}>登录</h4>
                        <span className={['spana ',formType === 'register'?'columna':''].join('')} onClick={ () => this.switchFrom('register') }>账号注册</span>
                    </div>
                    <div className="form-content">
                        {this.state.formType === 'login'?<LoginForm></LoginForm>:<RegisterForm></RegisterForm>}
                    </div>
                </div>
            </div>
        )
    }
}
export default Login;